import React, { Component } from 'react'
import { getMsg, getuserinfo } from '../../redux/actionCreator';
import Mytab from '../root/Mytab';
import { withRouter } from "react-router-dom"
import { connect } from 'react-redux'
import pxPage from '../../root/pxPage'
import { Conadd_tim, Conget_tim } from '../../TIM/actiontim';
import { imgInter } from '../../data/Interface';
import TIM from 'tim-js-sdk';
import COS from 'cos-js-sdk-v5';

let options = {
    SDKAppID: 1400458473
};
let tim = TIM.create(options);
// console.log(TIM.EVENT)
tim.setLogLevel(1);
tim.registerPlugin({ 'cos-js-sdk': COS });

class Privatechat extends Component {
    constructor(props) {
        super(props)
        this.state = {
            user: ''
        }
        console.log(this.props)
        this.props.dispatch(Conget_tim(this.props))
        tim.on(TIM.EVENT.CONVERSATION_LIST_UPDATED, (event) => {
            props.dispatch(Conadd_tim(event))
        })
    }
    render() {
        return (
            <div style={{ minHeight: '100vh', display: 'flex', width: '100%' }}>

                <div style={{ backgroundColor: "#080904", minHeight: '100vh', display: 'flex', width: '100%' }}>

                    <div style={{ width: '100%', margin: '0 auto' }}>
                        <div style={{ backgroundColor: '#2d2e29', borderBottomRightRadius: '50px', borderBottomLeftRadius: '50px', textAlign: 'center', fontSize: '1.5em', fontWeight: 'bold', paddingTop: '35px', paddingBottom: '30px' }}>我的消息</div>

                        {/* <div style={{ width: '100%', backgroundColor: '#2d2e29', borderTopRightRadius: '50px', borderTopLeftRadius: '50px' }}> */}
                        <ul className="privatechat-ul">
                            {
                                this.props.user.map((item, index) => {
                                    return <li key={index}
                                        className="privatechat-li"
                                        onClick={() => {
                                            this.props.history.push({
                                                pathname: '/kefu2',
                                                search: `user_phone = ${item.user_phone}`
                                            })
                                        }}
                                    >
                                        <img className="privatechat-img" src={`${imgInter}${item.user_pic}`} style={{ objectFit: 'cover'}}></img>
                                        <span className="privatechat-name">{item.user_name}</span>
                                    </li>
                                })
                            }
                        </ul>
                        {/* </div> */}
                    </div>
                    <Mytab />
                </div>
                <div style={{ flex: '1' }}></div>
            </div>
        )
    }
}

const mapStateToProps = (state) => ({
    login: state.login,
    // shop: state.shop,
    business: state.business,
    // shop_temp: state.shop_temp,
    conversation: state.conversation,
    message: state.message,
    user: state.user
})
export default withRouter(connect(mapStateToProps)(Privatechat))